<template>
    <el-dialog :visible.sync="visible" :title="dataForm.activityId ? '编辑' : '新增'" append-to-body>
        <el-form ref="dataForm" :model="dataForm" :rules="ruleValidate" label-width="120px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="活动名称" prop="activityName">
                        <el-input v-model.trim="dataForm.activityName" placeholder="输入活动名称" clearable
                            maxlength="30"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="获奖项目" prop="awardsProject">
                        <el-input v-model.trim="dataForm.awardsProject" placeholder="输入获奖项目" clearable
                            maxlength="30"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="活动地点" prop="activityAddress">
                        <el-input v-model.trim="dataForm.activityAddress" placeholder="输入活动地点" clearable
                            maxlength="30"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="注册号" prop="studentNo">
                        <el-row>
                            <el-col :span="dataForm.studentNo ? 12 : 24">
                                <el-input @input="selectStudent" v-model.trim="dataForm.studentNo" placeholder="输入获奖学生注册号"
                                    clearable maxlength="20"></el-input>
                            </el-col>
                            <el-col v-if="dataForm.studentNo" :span="11" :offset=1>
                                &nbsp;&nbsp;姓名:{{ dataForm.studentName || '未查询到' }}
                            </el-col>
                        </el-row>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="活动类型" prop="activityType">
                        <!-- <el-input v-model="dataForm.activityType" placeholder="输入活动类型" clearable></el-input> -->
                        <!-- <dict-tag :options="dict.type.sys_activity_type" :value="item.nation"></dict-tag> -->
                        <el-select v-model="dataForm.activityType" clearable placeholder="请选择" style="width: 100%">
                            <el-option v-for="dict in dict.type.sys_activity_type" :key="dict.value" :label="dict.label"
                                :value="Number(dict.value)"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="活动时间" prop="activityTime">
                        <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="dataForm.activityTime" type="datetime"
                            placeholder="选择活动时间">
                        </el-date-picker>
                    </el-form-item>
                </el-col>

            </el-row>
        </el-form>
        <div slot="footer">
            <el-button type="text" @click="handleCancel">取消</el-button>
            <el-button type="primary" :loading="showLoading" @click="handleSubmit">保存</el-button>
        </div>
    </el-dialog>
</template>
<script>
import {
    queryStudent,
} from "@/api/information/studentInfor";
import { addData, editData } from "@/api/assessmentCenter/activity";
export default {
    dicts: ["sys_activity_type"],
    data() {
        return {
            visible: false,
            showLoading: false,
            dataForm: {
                activityName: '',
                awardsProject: '',
                activityAddress: '',
                studentNo: null,
                activityType: '',
                activityTime: '',
                studentName: ''
            },
            ruleValidate: {
                activityName: [
                    { required: true, message: '请输入活动名称', trigger: 'blur' }
                ],
                awardsProject: [
                    { required: true, message: '请输入获奖项目', trigger: 'blur' }
                ],
                activityAddress: [
                    { required: true, message: '请输入获奖地点', trigger: 'blur' }
                ],
                studentNo: [
                    { required: true, message: '请输入获奖学生注册号', trigger: 'blur' }
                ],
                activityType: [
                    { required: true, message: '请选择活动类型', trigger: 'blur' }
                ],
                activityTime: [
                    { required: true, message: '请选择活动时间', trigger: 'blur' }
                ],

            }
        }
    },
  
    methods: {
        init(data) {
            // add or update
            this.visible = true;
            console.log(data, 'data')
            this.$nextTick(() => {
                this.$refs['dataForm']?.resetFields();
            });
            if (data) {
                this.$nextTick(() => {
                    this.dataForm = { ...data };;
                    this.dataForm.studentNo = data.registerCode;
                });
            } else {
                this.$nextTick(() => {
                    this.$refs['dataForm'].resetFields();
                });
                // this.$forceUpdate()
            }
        },

        handleCancel() {
            this.visible = false;
            this.disablePassword = true;
            this.showLoading = false;
        },
        handleSubmit() { // 表单提交
            let url = '/sys/schedule/' + (this.dataForm.jobId ? 'update' : 'save');
            let param = { ...this.dataForm }
            this.$refs['dataForm'].validate(async (valid) => {
                if (valid) {
                    if (!this.dataForm.studentName) {
                        this.$Message.error("请输入正确的学号")
                        return;
                    }
                    this.showLoading = true;
                    let data = {}
                    if (this.dataForm.activityId) {
                        data = await editData(param)
                    } else {
                        data = await addData(param)
                    }
                    if (data && data.code === 200) {
                        this.$modal.msgSuccess("操作成功");
                        this.handleCancel();
                        this.$emit('refreshDataList')
                    } else {
                        this.$Message.error(data.msg);
                        this.showLoading = false;
                    }
                }
            })
        },
        // 查询学生信息
        async selectStudent() {
            const { data } = await queryStudent({
                registerOrSno: this.dataForm.studentNo
            })
            if (data) {
                this.dataForm.studentName = data.name
                this.dataForm.studentId = data.id
            } else {
                this.dataForm.studentName = ''
                this.dataForm.studentId = null;
            }
        }
    }
}
</script>
  